.y-dialog-container
  .y-dialog.y-import-files-dialog(data-dialog-width='-1' data-dialog-height='-1')
    .y-dialog-title-bar
      .y-dialog-title Import Files
      .y-dialog-exit(data-bind='click:cancel')
        i.fa.fa-times 
    .y-dialog-body
      .y-dialog-margin
        // ko if:isImportMode
        .y-file-search-panel
          table
            tbody
              tr
                td
                  input.form-control(type='text' data-bind="value:specifiedPath, valueUpdate:'keydown', enterKey:tryImportFiles, typeahead:listPathHints" placeholder='Enter a file or directory path and hit Enter')
                td(width='1')
                  button.btn(data-bind='click:tryImportFiles')
                    i.fa.fa-search(style='font-size:14px')

        .y-file-search-results-panel
          // ko if:hasErrorMessage
          .y-error-message(data-bind='text:errorMessage')
          // /ko

          // ko if:hasImportedFiles
          .y-file-list-header
            span(data-bind='text:importedFileCount')
            button.btn(style='float:right' data-bind='click:selectAllFiles') Select All
          .y-file-list
            table.table.table-condensed.table-hover
              tbody
                // ko foreach:importedFiles
                tr
                  td(width='1')
                    .y-file(data-bind='click:toggle')
                      // ko if:isSelected
                      i.fa.fa-check-circle-o(title='This file is selected')
                      // /ko
                      // ko ifnot:isSelected
                      i.fa.fa-plus-circle(title='Select file')
                      // /ko
                      span(data-bind="text:path,css:{'y-is-selected':isSelected}")
                // /ko
          // /ko
        .y-file-selection-separator
        .y-file-selection-panel
          .y-file-list-header
            span(data-bind='text:selectedFileCount')
            // ko if:hasSelectedFiles
            button.btn(style='float:right' data-bind='click:deselectAllFiles') Deselect All
            // /ko
          // ko if:hasSelectedFiles
          .y-file-list
            table.table.table-condensed.table-hover
              tbody
                // ko foreach:selectedFiles
                tr
                  td(width='1')
                    .y-file(data-bind='click:deselect')
                      i.fa.fa-times-circle-o(title='Deselect file')
                      span(data-bind='text:path')
                // /ko
          // /ko

        .y-import-actions
          button.btn(data-bind='click:cancel') Cancel
          button.btn.btn-primary(data-bind='click:importSelectedFiles, enable:hasSelectedFiles')
            span Next&nbsp;
            i.fa.fa-arrow-right

        // /ko

        // ko if:isParseMode
        .y-dialog-content
          h1(data-bind='collapse:false') Sources
          table.table.table-condensed
            tbody
              // ko foreach:parsedFiles
              tr
                td(data-bind='text:name')
              // /ko

          h1(data-bind='collapse:false') Parse
          table
            tbody
              tr
                td
                  table
                    tbody
                      tr
                        td.y-form-header Destination Key
                        td.y-form-header Parser
                        td.y-form-header Separator
                      tr
                        td.y-form-field
                          input.form-control(style='width:300px' data-bind="value:destinationKey")

                        td.y-form-field
                          select.form-control(data-bind="options:parserTypes, optionsText:'caption', value:parserType")
                        td.y-form-field
                          select.form-control(data-bind="options:delimiters, optionsText:'caption', value:delimiter")
              tr
                td
                  table
                    tbody
                      tr
                        td.y-form-field
                          label.checkbox-inline
                            input(type='checkbox' data-bind='checked:useSingleQuotes')
                            span.caption Enable single quotes as a field quotation character
                          label.checkbox-inline
                            input(type='checkbox' data-bind='checked:deleteOnDone')
                            span.caption Delete on done
                      tr
                        td.y-form-field
                          span(style='display:inline-block;vertical-align:middle;font-size:11px;text-transform:uppercase') Column headers:&nbsp;
                          label.radio-inline
                            input(type='radio' name='hasHeader' value='auto' data-bind='checked:headerOption')
                            span Auto
                          label.radio-inline
                            input(type='radio' name='hasHeader' value='header' data-bind='checked:headerOption')
                            span First row contains column names
                          label.radio-inline
                            input(type='radio' name='hasHeader' value='data' data-bind='checked:headerOption')
                            span First row contains data



          // ko if:hasColumns
          h1(data-bind='collapse:false') Columns
          div(style='overflow:auto')
            table.table.table-condensed.table-striped.y-monospace.y-sample-table
              thead
                tr
                  // ko foreach:columns
                  th
                    input.form-control(type='textbox' data-bind="value:name, attr:{'title':name}")
                  // /ko

              tbody
                // ko foreach:rows
                tr
                  // ko foreach:$data
                  td(data-bind="text:$data")
                  // /ko
                // /ko
          // /ko
        .y-import-actions(style='width:50%;text-align:left')
          button.btn(data-bind='click:backToImport')
            i.fa.fa-arrow-left
            span &nbsp;Back
        .y-import-actions(style='width:50%;left:50%')
          button.btn(data-bind='click:cancel') Cancel
          button.btn.btn-primary(data-bind='click:parseFiles') Submit Parse Job

        // /ko
